<template>
  <div class="layout-container">
    <Drawer></Drawer>
    <SliderNavs></SliderNavs>
    <div class="right-container" :style="{ marginLeft: dataStore.isCollapse ? '64px' : '210px' }">
      <TopNavs></TopNavs>
      <div class="container">
        <RouterView></RouterView>
      </div>
    </div>
  </div>
</template>
<script setup>

import {RouterView} from 'vue-router';
import {onMounted} from 'vue';
import SliderNavs from "@/components/SliderNavs/index.vue"
import TopNavs from "@/components/TopNavs/index.vue"
import Drawer from "@/components/Drawer/index.vue"
import {useDataStore} from "@/stores/dataStore"

const dataStore = useDataStore()
onMounted(() => {

})
</script>
<style scoped>
.right-container {
  margin-top: 50px;
  margin-left: 210px;
  transition: 0.3s ease-in;
}
</style>
